<!DOCTYPE html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" href="../../css/bootstrap.min.css">
<link rel="stylesheet" href="../../css/font-awesome.min.css">
<link rel="stylesheet" href="../../plugins/jqgrid/ui.jqgrid-bootstrap.css">
<link rel="stylesheet" href="../../plugins/ztree/css/metroStyle/metroStyle.css">
<link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/summernote/0.8.1/summernote.css">
<link rel="stylesheet" type="text/css" href="../../plugins/webuploader/webuploader.css">
<link rel="stylesheet" type="text/css" href="../../layer/layui/css/layui.css">
<link rel="stylesheet" href="../../css/main.css">
<script src="../../libs/jquery.min.js"></script>
<script src="../../plugins/layer/layer.js"></script>
<script src="../../libs/bootstrap.min.js"></script>
<script src="../../libs/vue.min.js"></script>
<script src="../../plugins/jqgrid/grid.locale-cn.js"></script>
<script src="../../plugins/jqgrid/jquery.jqGrid.min.js"></script>
<script src="../../plugins/ztree/jquery.ztree.all.min.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/summernote/0.8.1/summernote.js"></script>
<script type="text/javascript" src="../../plugins/webuploader/webuploader.js"></script>
<script src="../../layer/layui/layui.js" charset="utf-8"></script>
<script src="../../js/common.js"></script>
</head>
<body>
<div id="rrapp" v-cloak>
	<div v-show="showList">
		<div class="grid-btn">
			<a v-if="hasPermission('module:blogarticle:save')" class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
			<a v-if="hasPermission('module:blogarticle:update')" class="btn btn-primary" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
			<a v-if="hasPermission('module:blogarticle:delete')" class="btn btn-primary" @click="del"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
		</div>
	    <table id="jqGrid"></table>
	    <div id="jqGridPager"></div>
    </div>
    
    <div v-show="!showList" class="panel panel-default">
		<div class="panel-heading">{{title}}</div>
		<form class="form-horizontal">
									<div class="form-group">
			   	<div class="col-sm-2 control-label">文章标题</div>
			   	<div class="col-sm-10">
			      <input type="text" class="form-control" v-model="blogArticle.articleTitle" placeholder="文章标题"/>
			    </div>
			</div>
									<div class="form-group">
			   	<div class="col-sm-2 control-label">文章作者</div>
			   	<div class="col-sm-10">
			      <input type="text" class="form-control" v-model="blogArticle.articleAuthor" placeholder="文章作者"/>
			    </div>

			</div>
			<div class="form-group">
				<div class="col-sm-2 control-label">分类</div>
				<div class="col-sm-10">
					<select v-model="blogArticle.cateId" class="form-control">
						<option class="form-control" v-for="item in items" v-bind:value="item.id" v-if="item.id" selected="selected">{{item.cateTitle}}</option>
					</select>
				</div>
			</div>
									<div class="form-group">
			   	<div class="col-sm-2 control-label">文章简介</div>
			   	<div class="col-sm-10">
					<textarea class="form-control" v-model="blogArticle.articleInfo" placeholder="文章简介" style="height: 100px;"  ></textarea>
			    </div>
			</div>
									<div class="form-group">
			   	<div class="col-sm-2 control-label">文章封面</div>
			   	<div class="col-sm-10">
					<div id="uploader-demo">
						<div class="layui-upload">
							<img class="form-control" v-bind:src="blogArticle.articleCover"  id="imgurl" style=" height: 400px;border: 1px dashed #ccc;">
							<div style="position: absolute;top: 50%;left: 50%;margin: -18px 0 0 -56px;">
								<input type="file" name="file" class="layui-upload-file" id="images">
							</div>

						</div>
					</div>

				</div>
			</div>
			<!--<div class="form-group">-->
				<!--<div class="col-sm-2 control-label">文章状态</div>-->
				<!--<div class="col-sm-10">-->
					<!--<select v-model="blogArticle.articleStatus"  class="form-control">-->
						<!--<option  class="form-control" v-for="item in selecte" v-bind:value="item.value">{{item.text}}</option>-->
					<!--</select>-->
				<!--</div>-->
			<!--</div>-->
									<div class="form-group">
				<div class="col-sm-2 control-label">文章内容</div>
				<div class="col-sm-10">
					<div class="ibox-content no-padding">
						<div id="content_sn" class="summernote"></div>
					</div>

				</div>
									</div>
									<div class="form-group">
			   	<div class="col-sm-2 control-label">原文链接</div>
			   	<div class="col-sm-10">
					<textarea class="form-control" v-model="blogArticle.articleOrigin" placeholder="原文链接" style="height: 60px;"></textarea>
			    </div>
			</div>
									<div class="form-group">
			   	<div class="col-sm-2 control-label">文章排序</div>
			   	<div class="col-sm-10">
			      <input type="number" class="form-control" v-model="blogArticle.articleSort" placeholder="文章排序"/>
			    </div>
			</div>

									<div class="form-group">
			   	<div class="col-sm-2 control-label">浏览次数</div>
			   	<div class="col-sm-10">
			      <input type="number" class="form-control" v-model="blogArticle.articleVisit" placeholder="浏览次数"/>
			    </div>
			</div>

							<div class="form-group">
				<div class="col-sm-2 control-label"></div> 
				<input type="button" class="btn btn-primary" @click="saveOrUpdate(1)" value="发布"/>
				&nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="saveOrUpdate(2)" value="存为草稿"/>
				&nbsp;&nbsp;<input type="button" class="btn btn-denger" @click="reload" value="返回"/>
			</div>
		</form>
	</div>
</div>

<script src="../../js/modules/blog/blogarticle.js"></script>
<script type="text/javascript">
    $('.summernote').summernote({
        height : '500px',
		width:'500px',
        minHeight: null,
        maxHeight: null,
        lang : 'zh-CN',
        disableDragAndDrop: true,
        callbacks: {
            onImageUpload: function(files) { //the onImageUpload API
                img = sendFile(files[0]);
            }
        }
    });

    function sendFile(file) {
        data = new FormData();
        data.append("file", file);
        console.log(data);
        $.ajax({
            data: data,
            type: "POST",
            url: baseURL + 'sys/oss/uploadPicture?token=' + token,
            cache: false,
            contentType: false,
            processData: false,
            success: function(url) {
                $(".summernote").summernote('insertImage', url.url.url, 'image name'); // the insertImage API
            }
        });
    }
</script>
<script>
    layui.use('upload', function(){
        layui.upload({
            url: baseURL + 'sys/oss/uploadPicture?token=' + token
            ,elem: '#images'
            ,method: 'post'
            ,success: function(res){
                $('#imgurl').attr('src', res.url.url);
            }
        });
    });
</script>

</body>
</html>